<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title></title>
    <meta charset="UTF-8">
    <title>注册验证入口-${site.title}</title>
    <meta name="keywords" content="${site.keywords},会员注册,注册验证入口">
    <meta name="description" content="${site.description}，注册验证入口">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="${site.favicon}" />
    <link href="/static/website/default/plugins/bootstrap/css/bootstrap.css" rel="stylesheet">
    <link href="/static/website/default/plugins/Font-Awesome-3.2.1/css/font-awesome.css" rel="stylesheet">
    <link href="/static/website/default/assets/css/main.css" rel="stylesheet">
    <link href="/static/website/default/assets/css/style.css" rel="stylesheet">
    <link href="/static/website/default/assets/css/footer.css" rel="stylesheet">
</head>
<body>
<#include "/website/default/common/header.html" />
<section class="main">
    <div id="container" class="container">
        <div class="thumbnail" style="max-width: 600px;margin: 0 auto;">
            <div class="caption">
                <div class='row'>
                    <div class="col-md-12" >
                        <form action="/register.html" class="register-form" id="register-from" onsubmit="return false;" style="padding:0 20px;" >
                            <h2 class="form-register-heading text-center">注册验证入口</h2>
                            <div class="form-group">
                                <div class="input-group">
                                    <span class="input-group-addon input-icon"><i class="glyphicon glyphicon-user"></i></span>
                                    <input name="username" id="username" type="text" value="${username}" class="form-control" placeholder="请输入用户名">
                                </div>
                            </div>
                            <div class="form-group register-captcha">
                                <div class="input-group required" aria-required="true">
                                    <span class="input-group-addon input-icon"><i class="glyphicon glyphicon-th-large"></i></span>
                                    <input id="captcha" name="captcha" type="text" class="form-control input-captcha" maxlength="6" placeholder="邮箱验证码">
                                </div>
                            </div>
                            <div class="error-message text-center" >
                                <span class="error-icon"></span>
                                <span id="error-msg" class="error-msg text-danger" ></span>
                            </div>
                            <div class="form-group">
                                <div class="text-center">
                                    <button type="submit" class="btn btn-block btn-primary">提 交</button>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="text-right">
                                    <a href="/login.html" class="btn-link go-to-login">已有账号？</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<#include "/website/default/common/footer.html" />


<#include "/website/default/common/mobile-bottom.html" />

<#include "/website/default/common/bottom.html" />

<script src="${request.contextPath}/static/manager/iframe/plugins/jQuery/validate/jquery.validate.js"></script>
<script src="${request.contextPath}/static/manager/iframe/plugins/jQuery/validate/jquery.validate.methods.js"></script>
<script type="text/javascript">
    function ajaxSubmit(form) {

        var $form = $(form);

        if ($form.length === 1 && $form.validate()) {
            $.post(form.action, $form.serialize(),
                function(result) {
                    if (result.status === 200) {
                        location.replace(result.data);
                    } else {
                        $form.find(".error-msg").html(result.message);
                        $form.find(".error-msg").show();
                    }
                }, 'json');
        }
    }

    $(function() {
        var $registerForm = $(".register-form");
        $registerForm.validate({
            rules: {
                captcha: {
                    required: true
                },
                username: {
                    required: true,
                    pattern: /^[a-zA-Z0-9]{5,12}$/
                }
            },
            messages: {
                captcha:{
                    required:"验证码不能为空！",
                    remote:"验证码错误！"
                },
                username: {
                    required: "登录名不能为空！",
                    pattern:"登录名格式错误！"
                }
            },
            submitHandler:ajaxSubmit,
            errorLabelContainer:".error-msg",
            wrapper:"li",
            showErrors:function(errorMap,errorList) {
                if(errorList.length>0){
                    $registerForm.find(".error-msg").html(errorList[0].message);
                }else{
                    $registerForm.find(".error-msg").html("");
                }
            },
            onkeyup: false
        });

    });
</script>
</body>
</html>